import React, { useState } from "react";
import { Tabs, Button } from "antd";
import "./HistoryRoom.css";

function HistoryRoom({ onClick }) {
  const changeTabPosition = (e) => {
    setTabPosition(e.target.value);
  };

  return (
    <>
      <div className="history-box">
        <div className="history-box-main">
          <Tabs
            defaultActiveKey={1}
            tabPosition="left"
            size="large"
            style={{ height: "100%" }}
            // items={tabFun}
          >
            <Tabs.TabPane tab="全部房间" key={1}>
              全部房间
            </Tabs.TabPane>
            <Tabs.TabPane tab="可用房间" key={2}>
              可用房间
            </Tabs.TabPane>
            <Tabs.TabPane tab="过期房间" key={3}>
              过期房间
            </Tabs.TabPane>
          </Tabs>
        </div>
        <div className="box-footer">
          <Button
            style={{ width: "25%" }}
            size="large"
            type="primary"
            key="ok"
            onClick={onClick}
          >
            关闭
          </Button>
        </div>
      </div>
    </>
  );
}

export default HistoryRoom;
